<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>055-ajax8.html</title>

</head>
<!-- 发送基本ajax请求-POS
	 封装函数
	 跨域-复杂请求
 -->
<body>
	<button id="btn">测试</button>
</body>
<script>
	function ajax(method,url,data,fnSucc,fnFailed){
		//1.生成ajax对象(购买电话)
		var oAjax = new XMLHttpRequest();

		if(method.toUpperCase() == 'POST'){
			//2.建立连接（拨号）
			oAjax.open(method,url,true);
			//可选，设置请求头
			oAjax.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
			//oAjax.setRequestHeader('Kuazhu-Test-Header','Kuazhu-Test-Header-Content');

			//3.发送信息(说话)
			oAjax.send(data);
		}else if(method.toUpperCase() == 'GET'){
			if(data){
				url = url + '?' + data;
			}
			//2.建立连接（拨号）
			oAjax.open(method,url,true);
			//3.发送信息(说话)
			oAjax.send();
		}else{
			//2.建立连接（拨号）
			oAjax.open(method,url,true);
			oAjax.setRequestHeader('Kuazhu-Test-Header','Kuazhu-Test-Header-Content');
			//3.发送信息(说话)
			oAjax.send();
		}
		//4.监听事件接收数据（听）
		oAjax.onreadystatechange = function(){

			if(oAjax.readyState == 4){//数据完全返回
				console.log(oAjax.getResponseHeader('Date'));
				console.log(oAjax.getResponseHeader('Access-Control-Allow-Origin'));
				console.log(oAjax.getResponseHeader('Content-Type'));
				console.log(oAjax.getResponseHeader('Kuazhu-Test'));


				if(oAjax.status == 200){//请求成功
					try{
						var obj = JSON.parse(oAjax.responseText);
						typeof fnSucc == 'function' && fnSucc(obj);
					}catch(e){
						console.log(e);
					}
				}else{
					typeof fnFailed == 'function' && fnFailed(oAjax.status);
				}
			}
		}
		oAjax.onerror = function(){
			console.log('error......');
		}
	}
	var oBtn = document.getElementById('btn');
	oBtn.onclick = function(){
			ajax('delete',
				'http://127.0.0.1:3001/edit',
				'',
				function(obj){
					console.log(obj);
				},
				function(status){
					console.log(status);
				}
			);
	}
</script>
</html>